<template>
    <a-modal :visible="visible" @ok="submit" @cancel="cancel" :width="1200">
        <h4>上架日期:</h4>
        <div style="margin: 10px 0;">
            <j-date v-model="model.menuDisplayTime" placeholder="开始日期" />
        </div>
        <h4>选择商家：</h4>
        <div class="table-page-search-wrapper">
            <a-form layout="inline" @keyup.enter.native="searchQuery">
                <a-row :gutter="24">
                    <a-col :span="6">
                        <a-form-model-item label="站点">
                            <j-dict-select-tag v-model="queryParam.siteId" dict-code="HC_SITE,NAME,ID" placeholder="请选择站点"
                                @change="" />
                        </a-form-model-item>
                    </a-col>
                    <a-col :span="6">
                        <a-form-model-item label="店铺">
                            <a-input v-model="queryParam.storeName" placeholder="请输入店铺名称" />
                        </a-form-model-item>
                    </a-col>
                    <a-col :span="6">
                        <span style="float: left; overflow: hidden" class="table-page-search-submitButtons">
                            <a-button type="primary" @click="searchQuery" icon="search">查询</a-button>
                        </span>
                    </a-col>
                </a-row>
            </a-form>
        </div>
        <div>
            <a-table ref="table" size="middle" :scroll="{ x: true }" :bordered="false" rowKey="id" :columns="columns"
                :dataSource="dataSource" :pagination="ipagination" :rowSelection="{
                    selectedRowKeys: selectedRowKeys,
                    onChange: onSelectChange,
                    getCheckboxProps: (record) => ({
                        props: {
                            disabled: record.disabled
                        }
                    })
                }" :loading="loading" class="j-table-force-nowrap" @change="handleTableChange">
                <template slot="imgSlot" slot-scope="text, record, index">
                    <span v-if="!text" style="font-size: 12px; font-style: italic">无图片</span>
                    <img v-else :src="getImgView(text)" height="25px" alt=""
                        style="max-width: 80px; font-size: 12px; font-style: italic" @click="showCropper(index)" />
                </template>
            </a-table>
        </div>
    </a-modal>
</template>

<script>
import { getAction } from '@/api/manage'
import { mixinDevice } from '@/utils/mixin'
import { JeecgListMixin } from '@/mixins/JeecgListMixin'
export default {
    name: 'AntDesignVueJeecgStoreAdd',
    mixins: [JeecgListMixin, mixinDevice],
    props: ['siteId'],
    data() {
        return {
            visible: false,
            columns: [
                {
                    title: '商户名称',
                    align: 'center',
                    dataIndex: 'storeName',
                }
            ],
            url: {
                list: '/hc/hcMerchant/list',
            },
            queryParam: {
                siteId: ''
            },
            model: {},
            storeIds: '',
            type: ''
        };
    },
    mounted() {

    },

    methods: {
        show(type, siteId, storeId, companyInfo) {
            this.visible = true;
            this.queryParam.siteId = siteId;
            this.type = type;
            this.storeIds = storeId;
            if (type == 'edit') {
                this.model.menuDisplayTime = companyInfo.menuDisplayTime
            }
            this.loadData();
        },
        loadData(arg) {
            if (!this.url.list) {
                this.$message.error("请设置url.list属性!")
                return
            }
            //加载数据 若传入参数1则加载第一页的内容
            if (arg === 1) {
                this.ipagination.current = 1;
            }
            var params = this.getQueryParams();//查询条件
            this.loading = true;
            getAction(this.url.list, params).then((res) => {
                if (res.success) {
                    this.dataSource = res.result.records || res.result;
                    if (res.result.total) {
                        this.ipagination.total = res.result.total;
                    } else {
                        this.ipagination.total = 0;
                    }
                } else {
                    this.$message.warning(res.message)
                }

                this.dataSource.forEach((item, index) => {
                    this.$set(this.dataSource[index], 'disabled', this.storeIds.indexOf(item.id) != -1 ? true : false)
                })
            }).finally(() => {
                this.loading = false
            })
        },
        cancel() {
            this.selectedRowKeys=[];
            this.selectionRows=[]
            this.visible = false;
        },
        submit() {
            if (this.selectedRowKeys.length == 0) {
                this.$message.warning("请至少选择一个店铺");
                return;
            }
            if (!this.model.menuDisplayTime) {
                this.$message.warning("请选择菜单生效日期");
                return;
            }
            this.$emit('getStoreList', { merchantIds: this.selectedRowKeys.join(','), menuDisplayTime: this.model.menuDisplayTime });
        }
    },
};
</script>

<style lang="scss" scoped></style>